<%@ Page Language="C#" MasterPageFile="~/Site.master" Title="GridView Mouseover/out" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" Runat="Server">
    <h3>Supplier Information</h3>
    <AjaxData:GridView ID="GridView1" runat="server" CssClass="DataWebControlStyle" CellSpacing="0" CellPadding="3" 
        RowMouseOverEvent="onRowMouseOver"
        RowMouseOutEvent="onRowMouseOut"
        DataBoundEvent="">
       <AlternatingRowStyle CssClass="AlternatingRowStyle" />
       <RowStyle CssClass="RowStyle" />
       <HeaderStyle CssClass="HeaderStyle" />
       <EmptyDataTemplate>
        There is no records available.
       </EmptyDataTemplate>
       <EmptyDataRowStyle HorizontalAlign="Center" />
    </AjaxData:GridView>

    <script type="text/javascript">

        function pageLoad(sender, e)
        {
            DataService.GetAllSupplier(onLoadSuccess);
        }
        
        function onLoadSuccess(result)
        {
            GridView1.set_dataSource(result);
            GridView1.dataBind();
        }
        
        function onRowMouseOver(sender, e)
        {
            var row = e.get_row();
            if (row.get_isDataRowType())
            {
                var tr = row.get_container();
                tr.style.backgroundColor="red";
            }
        }
        
        function onRowMouseOut(sender, e)
        {   
            var row = e.get_row();
            if (row.get_isDataRowType())
            {
                var tr = row.get_container();
                tr.style.backgroundColor="";
            }
        }

    </script>

</asp:Content>